<template>
  <div>
    <Table
      stripe
      ref="selection"
      border
      :columns="columns"
      :data="orderlist"
      size="large"
      no-data-text="你还有订单，快点去购物吧"
    >
      <template slot-scope="{ row}" slot="action">
        <div v-if="row.order_status==1">
          <Button type="success">已发货</Button>
        </div>
        <div v-else>
          <Button type="error">未发货</Button>
        </div>
      </template>
    </Table>
    <div class="page-size">
      <Page :total="total" show-total></Page>
    </div>
         <!-- <Button type="primary" @click="change">修改发货状态</Button> -->

  </div>
</template>

<script>
export default {
  name: "MyOrder",
  data() {
    return {
      queryInfo: {
        query: window.sessionStorage.userid
      },
      // 个人的订单列表
      orderlist: [],
      total: 1,
      columns: [
        {
          title: "订单编号",
          key: "ordernumber",
          // width: 180,
          align: "center"
        },
        {
          title: "书名",
          key: "bookname",
          width: 280,
          align: "center"
        },
        {
          title: "用户名",
          key: "username",
          width: 180,
          align: "center"
        },
        {
          title: "联系电话",
          key: "mobile",
          width: 198,
          align: "center"
        },
        {
          title: "收货地址",
          width: 198,
          key: "address",
          align: "center"
        },
        {
          title: "数量",
          key: "count",
          width: 98,
          align: "center"
        },
        {
          title: "订单状态",
          slot: "action",
          // width: 300,
          resizable: true,
          align: "center"
        }
      ]
    };
  },
  methods: {
    async getOrderList() {
      const { data: res } = await this.$axios.get(
        "http://localhost:8080/api/admin/orderlist",
        {
          params: this.queryInfo
        }
      );
      console.log(res);
      this.total = res.total;
      this.orderlist = res.data;
    },
    handleSelectAll(status) {
      this.$refs.selection.selectAll(status);
    },
    async change(){
        const {data:res}=await this.$axios.put("http://localhost:8080/api/admin/orderlist/editorder/"+29)
    }
  },
  created() {
    this.getOrderList();
  }
};
</script>

<style scoped>
.page-size {
  margin: 15px 0px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
</style>